@charset "utf-8";

@import "common";


.article_content{
    background-color: #fff;
}
.realize_gimc{
    position: relative;
    width: 100%;
    height: r(221px);
    padding-top: r(7px);
    overflow: hidden;
    background: url(../img/gimc_k.jpg) no-repeat content-box;
    background-size: 100%;
    .gimc_know_more{
        width: r(305px);
        height: r(58px);
        line-height: r(50px);
        text-align: center;
        position: absolute;
        bottom: r(14px);
        left: r(28px);
        padding: r(4px) 0;
        font-size: r(25px);
        background-color: #fff;
        color: #b20000;
        span{
            float: right;
            clear: both;
            padding-left: r(25px);
            padding-right: r(15px);
            padding-top: r(2px);
            display: inline-block;
            height: r(50px);
            line-height: r(50px);
            border-left: 1px solid #b20000;
        }
    }
}
.gimc_content{
    padding: 0 r(30px);
    .list_gimc{
        padding: r(47px) 0 r(30px);
        display: flex;
        justify-content: space-between;
        border-bottom: 1px solid #cecece;
        .gimc_pic{
            margin-right: r(15px);
            padding-top: r(5px);
            height: r(142px);
            width: r(210px);
            overflow: hidden;
            img{
                height: 100%;
                width: 100%;
            }
        }
        .gimc_desc{
            height: r(142px);
            width: r(360px);
            
            h4{
                width: r(360px);
                height: r(49px);
                font-size: r(22px);
                font-weight: 500;
                line-height: r(27px);
                text-align: justify;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            p{
                width: r(360px);
                height: r(46px);
                font-size: r(20px);
                line-height: r(23px);
                margin-top: r(7px);
                text-align: justify;
                color: #c5c5c5;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .time_see{
                margin-top: r(22px);
                text-align: right;
                line-height: r(18px);
                font-size: r(18px);
                color: #939393;
                i{
                    font-size: r(20px);
                    margin-left: r(20px);
                    &::before{
                        margin-right: 10px;
                        font-size: r(22px);
                    }
                }
            }
        }
    }
}

//介绍页
.gimc_intro{
    position: fixed;
    top: r(90px);
    bottom: r(95px);
    left: 0;
    width: 100%;
    z-index: 2;
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: scroll;
    transform: translateX(100%);
}

.intro_nav{
    position: absolute;
    top: r(182px);
    display: flex;
    height: r(117px);
    width: 100%;
    padding-top: r(7px);
    background-color: #f5f5f5;
    z-index: 2;
    .nav_touch{
        height: r(88px);
        line-height: r(88px);
        text-align: center;
        width: 33.33%;
        font-size: r(27px);
        border-bottom: 1px solid #dfdfdf;
        background-color: #f5f5f5;
        color: #8b8b8b;
        &:first-child{
            background-color: #b20000;
            color: #FFF;
        }
    }
}

.nav_content{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    transform: translateX(100%);
    transition: all 1s;
    overflow-x: hidden;
    overflow-y: scroll;
}

//新闻详细页
.gimc_new{
    position: fixed;
    top: r(90px);
    bottom: r(95px);
    left: 0;
    width: 100%;
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 3;
    padding: 0 r(30px);
    transform: translateX(100%);
    .new_title{
        font-size: r(30px);
        font-weight: 400;
        text-align: justify;
        padding-top: r(40px);
    }
    .new_see{
        text-align: right;
        line-height: r(22px);
        margin-top: r(13px);
        i{
            font-size: r(20px);
            color: #c5c5c5;
            &::before{
                font-size: r(25px);
                margin-right: r(7px);
            }
        }
    }
    .new_date{
        line-height: r(24px);
        margin-top: r(8px);
        text-align: right;
        font-size: r(22px);
        color: #c5c5c5;
        span{
            margin-left: r(11px);
            color: #b20000;
        }
    }
    .new_desc{
        padding-top: r(7px);
        padding-bottom: r(30px);
        border-bottom: 1px solid #e6e6e6;
        p{
            margin-top: r(27px);
            font-size: r(20px);
            line-height: r(28px);
            color: #8b8b8b;
            text-align: justify;
            text-indent: 2em;
            &:last-child{
                text-indent: 0;
            }
        }
        div{
            margin-top: r(35px);
            width: 100%;
            height: r(233px);
            img{
                height: 100%;
                width: 100%;
                display: block;
            }
        }
    }
    .new_collect{
        padding: r(27px) r(101.5px) r(56px);
        display: flex;
        justify-content: center;
        flex-wrap: nowrap;
        .dsf{
            align-items: center;    
            margin: 0 r(27.5px);
            i{
                display: block;
                height: r(72px);
                width: r(72px);
                border-radius: 50%;
                line-height: r(72px);
                text-align: center;
                border: r(3px) solid #8b8b8b;
                &::before{
                    font-size: r(27px);
                    color: #c5c5c5;
                }
                
            }
            p{
                font-size: r(20px);
                text-align: center;
                margin-top: r(8px);
                color: #8b8b8b;
            }
        }
    }
}

//GIMC简介
.gimc_pro{
    .pro_photo_top{
        padding-top: r(7px);
        width: 100%;
        height: r(182px);
        overflow: hidden;
        img{
            height: 100%;
            width: 100%;
            display: block;
        }
    }
    .pro_desc{
        padding: r(26px) r(30px) r(24px);
        margin-top: r(117px);
        .desc_s{
            text-align: justify;
            margin-top: r(20px);
            line-height: r(28px);
            font-size: r(20px);
            color: #8b8b8b;
            text-indent: 2em;
        }
        .pro_video{
            padding: r(38px) 0 r(30px);
            margin-bottom: r(15px);
            width: 100%;
            height: auto;
            overflow: hidden;
            border-top: 1px solid #e4e4e4;
            border-bottom: 1px solid #e4e4e4;
            img{
                height: 100%;
                width: 100%;
            }
        }
        .we_course{
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 r(25px);
            width: 100%;
            height: r(78px);
            line-height: r(78px);
            background-color: #b20000;
            i{
                font-size: r(30px);
                color: #fff;
                &::before{
                    display: inline-block;
                    margin-right: r(25px);
                    font-size: r(43px);
                    vertical-align: middle;
                }
            }
        }
    }
}

ul{
    width: 100%;
    border-bottom: 1px solid #dfdfdf;
    .course_date{
        width: 100%;
        padding-left: r(43px);
        &:nth-child(2n){
            background-color: #f3f3f3;
            .date_list{
                .course_circle{
                    border-color: #b20000;
                    &::before{
                        background-color: #b20000;
                        border-radius: 55%;
                    }
                }
            }
        }
        .date_list{
            position: relative;
            padding-left: r(44px);
            padding-top: r(32px);
            padding-bottom: r(22px);
            border-left: r(4px) solid #d0dbdc;
            .course_circle{
                display: inline-block;
                position: absolute;
                height: r(40px);
                line-height: r(5px);
                width: r(40px);
                text-align: center;
                border-radius: 60%;
                border: r(5px) solid #d0dbdc;
                left: r(-22px);
                top: r(47px);
                background-color: #fff;
                &::before{
                    content: "";
                    display: inline-block;
                    width: r(17px);
                    height: r(17px);
                    border-radius: 55%;
                    background-color: #d0dbdc;
                }
            }
            h4{
                font-size: r(31.64px);
                color: #313131;
                font-weight: 500;
            }
            p{
                font-size: r(20px);
                color: #b20000;
            }
        }
    }
}

//团队管理
.gimc_team{
    .gimc_member{
        margin-top: r(117px);
        padding: r(15px) r(30px);
        background-color: #fff;
        width: 100%;
        .gimc_per{
            display: flex;
            align-items: flex-start;
            margin-bottom: r(48px);
            .per_pic{
                flex-shrink: 0;
                height: r(127px);
                width: r(107px);
                padding-top: r(2px);
                overflow: hidden;
                margin-right: r(19px);
                img{
                    height: 100%;
                    width: 100%;
                    display: block
                }
            }
            .per_desc{
                flex-grow: 1;
                h5{
                    font-size: r(27px);
                    line-height: r(29px);
                    padding-bottom: r(7px);
                    border-bottom: 1px solid #e09999;
                    color: #b50007;
                }
                p{
                    text-align: justify;
                    font-size: r(22px);
                    color: #7d7d7d;
                }
            }
        }
    }
}

//3
.gimc_pro_th{
    width: 100%;
    height: auto;
    .back{
        width: 100%;
        height: r(182px);
        line-height: r(182px);
        font-size: r(150px);
        text-align: center;
        color: #B20000;
        i{
            font-size: r(100px);
            color: #B20000;
        }
    }
    div{
        margin-top: r(125px);
        img{
            width: 100%;
            height: auto;
        }
    }
    
}

//点击类
.navcontent_active{
    transform: translateX(0);
    transition: all 1s;
}
